<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<% String path = request.getContextPath(); %>
<html>
<head>
    <title>nucleic</title>
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi"/>
    <link rel="icon" href="<%=path%>/images/favicon.ico" sizes="32x32"/>
    <link rel="stylesheet" href="<%=path%>/css/font.css">
    <link rel="stylesheet" href="<%=path%>/css/xadmin.css">
    <script type="text/javascript" src="<%=path%>/js/jquery-1.3.2.min.js"></script>
    <script src="<%=path%>/lib/layui/layui.js"></script>
    <script type="text/javascript" src="<%=path%>/js/xadmin.js"></script>
    <script src="<%=path%>/layui_exts/excel.js"></script>
    <style type="text/css">
        .layui-table {
            text-align: center;
        }

        .layui-table th {
            text-align: center;
        }
    </style>
</head>

<body>
<div class="x-nav">
      <span class="layui-breadcrumb">
       <a href="">首页</a>
        <a href="<%=path%>/resident/reportList">查询列表</a>
      </span>
    <a class="layui-btn layui-btn-sm" style="line-height:1.6em;margin-top:3px;float:right"
       href="<%=path%>/rubbish/reportList" title="刷新">
        <i class="layui-icon" style="line-height:30px">&#xe669;</i></a>
</div>
<div class="x-body">
    <div class="layui-row">
        <form class="layui-form layui-col-md12 x-so" action="<%=path%>/rubbish/reportList">
            <input class="layui-input" type="hidden" name="pageIndex" value="1">
            <input class="layui-input" type="hidden" name="pageSize" value="5">
        </form>
    </div>
    <xblock>
        <%--        <button id="addResidentBtn" class="layui-btn layui-btn-sm"><i class="layui-icon">&#xe654;</i>添加</button>--%>
        <span class="x-right" style="line-height:40px">共有数据：${pageList.totalCount} 条</span>
    </xblock>


    <%--表格数据--%>
    <table class="layui-table">
        <thead>
        <tr>
            <th>回收员</th>
            <th>回收物</th>
            <th>举报原因</th>
            <th>举报时间</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <c:forEach items="${pageList.list}" var="di">
            <tr>
                <th>${di.name}</th>
                <th>${di.rubbishName}</th>
                <th>${di.reason}</th>
                <th>${di.createtimeStr}</th>
                <td>
                    <a title="查看或编辑" onclick="reportEditBtn('${di.id}')" href="#">
                        <i class="layui-icon">&#xe642;</i>
                    </a>
                    <a title="删除" onclick="member_del(this,'${di.id}')" href="javascript:;">
                        <i class="layui-icon">&#xe640;</i>
                    </a>

                </td>
            </tr>
        </c:forEach>
        </tbody>
    </table>

    <div class="">
        <input type="hidden" id="totalPageCount" value="${pageList.pageTotalCount}"/>
        <c:import url="pageBtn.jsp">
            <c:param name="totalCount" value="${pageList.totalCount}"/>
            <c:param name="currentPageNo" value="${pageList.pageIndex}"/>
            <c:param name="totalPageCount" value="${pageList.pageTotalCount}"/>
        </c:import>
    </div>

    <%--更新--%>
    <div class="layui-row" id="edit" style="display: none;">
        <div class="layui-col-md10">
            <form class="layui-form" id="editReportForm">
                <div style="margin-top: 20px;"></div>
                <div class="layui-form-item">
                    <label class="layui-form-label">回收员姓名：</label>
                    <div class="layui-input-block">
                        <input type="text" name="name" id="name" class="layui-input" placeholder="请输入回收员姓名">
                    </div>
                    <input type="hidden" id="id" name="id">
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">回收物品：</label>
                    <div class="layui-input-block">
                        <input type="text" name="rubbishName" id="rubbishName" class="layui-input" placeholder="请输入回收的物品">
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">举报原因：</label>
                    <div class="layui-input-block">
                        <input type="text" name="reason" id="reason" class="layui-input" placeholder="请输入举报原因">
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-input-block">
                        <button type="button" class="layui-btn layui-btn-normal" lay-submit lay-filter="formDemo">提交
                        </button>
                        <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                    </div>
                </div>
            </form>
        </div>
    </div>


    <script>
        layui.config({
            base: 'layui_exts/',
        });

        /*编辑*/
        function reportEditBtn(id) {
            $.ajax({
                url: '<%=path%>/report/findReportById?id=' + id,
                type: "get",
                contentType: "application/json; charset=utf-8",
                dataType: 'json', //添加这一条语句
                success: function (res) {
                    console.log(res)
                    layui.use(['jquery', 'form', 'layer', 'laydate'], function () {
                        var form = layui.form, $ = layui.jquery;
                        layer.open({
                            type: 1,
                            title: "编辑",
                            skin: "myclass",
                            area: ["50%"],
                            anim: 2,
                            content: $("#edit"),
                            success: function () {
                            }
                        });
                        $("#editReportForm")[0].reset();
                        document.getElementById("id").value = res.id;
                        document.getElementById("name").value = res.name;
                        document.getElementById("rubbishName").value = res.rubbishName;
                        document.getElementById("reason").value = res.reason;

                        form.on('submit(formDemo)', function (data) {
                            var param = data.field;
                            $.ajax({
                                url: '<%=path%>/report/updateReport',
                                type: "post",
                                data: JSON.stringify(param),
                                contentType: "application/json; charset=utf-8",
                                success: function (res) {
                                    layer.msg('修改成功', {icon: 1, time: 3000});
                                    setTimeout(function () {
                                        window.location.href = '<%=path%>/rubbish/reportList';
                                    }, 2000);
                                },
                                error: function () {
                                    layer.msg('修改失败', {icon: 0, time: 3000});
                                    setTimeout(function () {
                                        window.location.href = '<%=path%>/rubbish/reportList';
                                    }, 2000);
                                }
                            });
                        });
                    });
                },
                error: function () {
                    layer.msg('获取失败', {icon: 0, time: 3000});
                    setTimeout(function () {
                        window.location.href = '<%=path%>/rubbish/reportList';
                    }, 2000);
                }
            });
        }

        /*删除*/
        function member_del(obj, id) {
            layer.confirm('确认要删除吗？', function (index) {
                //发异步删除数据
                $.get("<%=path%>/rubbish/deleteReport?id=" + id, function (data) {
                    layer.msg('删除成功!', {icon: 1, time: 2000});
                    setTimeout(function () {
                        window.location.href = '<%=path%>/rubbish/reportList';
                    }, 2000);
                });
            });
        }
    </script>
</body>
</html>
